<script setup lang='ts'>
const props = withDefaults(defineProps<{
  color?: string
  title?: string
  themeKey?:string
}>(), {
})

const emit = defineEmits(['click'])
const changeTheme = () => emit('click', props.themeKey)

</script>

<template>
  <el-tooltip class="box-item" effect="dark" :content="title" placement="top-start">
    <div  @click='changeTheme()' class="w-[20px] h-[20px]" :style="{'background-color':color}"></div>
  </el-tooltip>

</template>

<style lang='scss' scoped></style>
